<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>档案管理系统</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/dist/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/dist/css/ionicons.min.css">
    <link rel="stylesheet" href="/static/dist/css/AdminLTE.min.css">
    <link rel="stylesheet" href="/static/dist/css/skins/all-skins.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-treeview.css">
    <link rel="stylesheet" href="/static/css/bootstrapValidator.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-table.min.css">
    <link rel="stylesheet" href="/static/layer/theme/default/layer.css">
    <link rel="stylesheet" href="/static/plugins/morris/morris.css">
    <link rel="stylesheet" href="/static/css/element-ui.css">
    <link rel="stylesheet" href="/static/webCss/sy.css?v=shujubuwqd12138">
    <link rel="stylesheet" href="/static/css/bootstrap-select.min.css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="/static/plugins/ie9/html5shiv.min.js"></script>
    <script src="/static/plugins/ie9/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition skin-blue" style="font-size: medium;background-color: #F4F6FA">

<div class="content row" id="yhgl" style="weight:500px;height: 770px">
    <div class="modal" id="fwytxz" data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">房屋用途选择</h4>
                </div>
                <div class="modal-body">
                    <div class="col-xs-12">
                        <h4>房屋用途选择</h4>
                    </div>
                    <div class="col-xs-12">
                        <select id="fwytselect" data-live-search="true" class="form-control selectpicker"></select>
                        <small style="color: #c01921">如下拉框中没有对应的选项，请将内容填到下方输入框中</small>
                        <input type="text" class="form-control input-sm" id="fwytselect2">
                    </div>
                </div>
                <div class="modal-footer" style="margin-top: 20px">
                    <div class="text-center" >
                        <a class="btn btn-primary" onclick="surefwyt()">确定</a>
                    </div>
                </div>

            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <div>
        <div class="box" style="border-radius: 15px">
            <div class="box-header with-border">
                <h3 class="box-title" style="font-weight: bold">更多档案</h3>
            </div>
            <div class="box-body chart-responsive" style="padding-top: 0px">
                <table class="table table-bordered table-hover text-center" id="userTable">

                </table>
            </div>
            <!-- /.box-body -->
        </div>
    </div>
</div>

<script src="/static/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
<!-- Slimscroll -->
<script src="/static/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="/static/plugins/fastclick/fastclick.js"></script>

<!-- AdminLTE App -->
<script src="/static/dist/js/app.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/static/dist/js/demo.js"></script>
<!--tabs-->
<script src="/static/dist/js/app_iframe.js"></script>
<script src="/static/js/bootstrap-treeview.js"></script>
<script src="/static/js/bootstrapValidator.min.js"></script>
<script src="/static/js/bootstrap-table.min.js"></script>
<script src="/static/js/bootstrap-table-zh-CN.js"></script>
<script src="/static/js/vue.js"></script>
<script src="/static/js/vue-resource.min.js"></script>
<script src="/static/layer/layer.js"></script>
<script src="/static/js/myJs.js"></script>
<script src="/static/plugins/morris/morris.js"></script>
<script src="/static/plugins/Raphael/raphael.min.js"></script>
<script src="/static/js/element-ui.js"></script>
<!--<script src="/static/js/highcharts.js"></script>-->
<!--<script src="/static/js/exporting.js"></script>-->
<!--<script src="/static/js/highcharts-zh_CN.js"></script>-->
<!--<script src="/static/js/grid-light.js"></script>-->
<script src="/static/js/echarts.min.js"></script>
<script src="/static/js/newJs.js"></script>
<script src="/static/js/bootstrap-select.min.js"></script>
<script src="/static/fwytmc.js"></script>
<!--<script src="https://unpkg.com/element-ui/lib/index.js"></script>-->

<script type="text/javascript">
    var rowIndexFwyt = -1;
    function fwytshow(rowIndex){
        rowIndexFwyt = rowIndex;
        $('#fwytxz').modal('show');
    }

    function surefwyt(){
        if(rowIndexFwyt == -1){
            cxAlert("无效的操作");
            return;
        }
        var rows = $('#userTable').bootstrapTable('getData');
        var row = rows[rowIndexFwyt];
        if($("#fwytselect2").val() != null && $("#fwytselect2").val() != '' &&$("#fwytselect2").val() != undefined){
            row.fwytmc =$("#fwytselect2").val();
        }else {
            row.fwytmc =$("#fwytselect").val();
        }
        rowIndexFwyt= -1;
        $("#userTable").bootstrapTable('load',rows);
        $('#fwytxz').modal('hide');
    }
    var vue = new Vue({
        el: '#yhgl',
        data: {

        },
        methods: {
        },
        created: function () {
        },
        mounted: function () {
            $("#userTable").bootstrapTable('destroy');
            $('#userTable').bootstrapTable({
                url: '/jy/api/queryJy',
                contentType: "application/json; charset=UTF-8",
                type: "GET",
                dataType: 'json',
                queryParamsType: "",
                sortName : 'id',
                sortOrder : 'desc',
                singleSelect: true,
                striped: true,
                smartDisplay: false,
                cache: false,
                pagination: true,  //设置为 true 会在表格底部显示分页条。
                paginationLoop: false, //设置为 true 启用分页条无限循环的功能。
                pageSize: 10,//每页初始显示的条数
                pageList: [10],
                toolbar: "#addtool",
                sidePagination: 'server',
                queryParams: function (params) {
                    return {'pageNum': params.pageNumber, 'pageSize': params.pageSize,'sort':params.sortOrder};
                },
                toolbar: "#addtool",
                columns: [ {
                    field: 'id',
                    title: '序号',
                    sortable : true,
                },{
                    field: 'dabh',
                    title: '档案编号',
                }, {
                    field: 'ajtm',
                    title: '案卷题名',
                }, {
                    field: 'nf',
                    title: '年份',
                }, {
                    field: 'dtslbh',
                    title: '大厅受理编号',
                }, {
                    field: 'jsdw',
                    title: '建设单位',
                },{
                    field: 'jssj',
                    title: '借阅结束时间',
                },{
                    field: 'cz',
                    title: '操作',
                    formatter: function (value, row, index) {
                        var btnStr = "<span class='btn btn-success' onclick='fwytshow("+index+")' >房屋用途选择</span>";
                        return btnStr;
                    }
                },{
                    field: 'fwytmc',
                    title: '房屋用途名称',
                }],
                responseHandler: function (res) {  //后台返回的结果
                    if (res.code == "200") {
                        var data = res.data;
                        var NewData = [];
                        for (i = 0; i < data.data.length; i++) {
                            NewData.push(data.data[i]);
                        }
                        var data = {
                            rows: NewData,
                            total: data.total
                        };
                        return data;
                    }
                }
            });
        }
    });


    var fwytSelect = '';
    var fwytdata=fwytJson; //列表数据
    for(var i = 0;i < fwytJson.length;i++ ){
        fwytSelect += "<option  value=\'"+fwytJson[i]+"\' >"+fwytJson[i]+"</option>"
    }
    $("#fwytselect").html(fwytSelect);

    $("#fwytselect").selectpicker();


</script>

</body>
</html>
